// 需要比对ruleNames,所以需要引入store并拿到ruleNames
import store from "@/store/index"

function hasPermission(value,el = false){
  //判断 ruleNames[] 中是否含有权限别名
  if(!Array.isArray(value)){//先保证传入的是数组
      throw new Error(`需要配置权限，例如v-permisssion="['getStatistics3,GET']"`)
  }
  // store.state.ruleNames是用户拥有的权限列表
  // value.findIndex（v=>...）本身返回的结果是数字类型--索引或-1；而!= -1则将结果转化为布尔值
  const hasAuth = value.findIndex(v=>store.state.ruleNames.includes(v)) != -1
  if(el && !hasAuth){
    // 如果传入了节点 但是没有该权限 就要移除该节点
    // &&--当左侧为false,不会执行右侧--先检查el是否具有父节点--安全执行
    // 不使用el.remove();是因为现代浏览器--IE不支持
    el.parentNode && el.parentNode.removeChild(el)
  }
  return hasAuth
}

export default {
  install(app){
    app.directive("permission",{
      // el是被权限别名绑定的的DOM节点，binding是指其对应节点包含信息的对象
      // mounted执行-- 这个时候权限别名已经被添加到DOM节点中，所以可以调用hasPermission（）
      mounted(el,binding){
        //数组里面的值--权限别名
        hasPermission(binding.value,el)
      }
    })
  }
}